<!-- 装箱入库-列表 -->
<template>
	<view class="ku-content ku-flex-button-content">
		<view class="">
			<u-cell-group>
				<u-cell>
					<view slot="value">
						<u-button type="primary" icon="plus" @click="linkPackingClick"></u-button>
					</view>
				</u-cell>
			</u-cell-group>
		</view>
		<view class="ku-section">
			<u-list @scrolltolower="scrolltolowerFun" scroll-y="true" :showScrollbar='true' :pagingEnabled='true'
				:height='scrolltolowerHeight'>
				<u-list-item v-for="(item,index) in packingList" :key="item.fbillNo">
					<view class="ku-card ku-margin-bottom-20" @click="linkPackingClick('edit',item)"
						:key="item.fbillNo">
						<view class="ku-card-head ku-display-flex ku-flex-space-between">
							单据/箱号：{{item.fbillNo}}

							<u-tag v-if="item.fdocumentStatus==='C'" text="已审批" plain size="mini"></u-tag>
						</view>
						<view class="ku-card-body">
							<view class="ku-xs-title ">
								单据日期：{{formatDateDayFun(item.f_RYJF_DJRQ)}}
							</view>
						</view>
					</view>
				</u-list-item>
				<u-divider v-if="loadMoreState" text="加载更多"></u-divider>
				<u-divider v-else text="没有更多了"></u-divider>
			</u-list>



		</view>

		<!-- 		<u-empty v-else mode="data" marginTop='40px'>
		</u-empty> -->

		<u-modal :show="modalShow" :title="modalTitle" :content='modalContent' @confirm="confirmCloseModal"
			:closeOnClickOverlay="true"></u-modal>
		<u-notify ref="uNotify"></u-notify>
	</view>
</template>

<script>
	import Dayjs from "dayjs";
	import store from "@/store";
	import {
		getPackingListApi,
	} from "@/api/index.js";

	import {
		phoneCameraScanCode,
	} from "@/utils/public.js";

	export default {
		data() {
			return {
				packingList: [], // 装箱单列表
				scrolltolowerHeight: 750, // 
				pageNumber: 1, // 客户分页
				pageSize: 20, // 分页条数

				loadMoreState: true, // 加载更多

			};
		},
		// 数据监听
		watch: {

		},
		/*
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {

		},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow() {
			this.pageShowInit();
			this.getPackingListFun(); // 获取装箱列表
		},
		/**
		 * 生命周期函数--监听页面显示
		 */
		methods: {
			pageShowInit() {
				console.log('显示设备-------  ------->')
				let _that = this;
				let systemInfo = uni.getSystemInfoSync();
				_that.scrolltolowerHeight = systemInfo.screenHeight - 180
			},
			// 日期格式化
			formatDateDayFun(val) {
				if (val) {
					return Dayjs(val).format('YYYY-MM-DD');
				} else {
					return '';
				}

			},
			// 分页
			scrolltolowerFun() {
				if (!this.loadMoreState) {
					return
				}
				console.log('分页--------->');
				++this.pageNumber;
				this.getPackingListFun(true);
			},

			// 获取装箱list--王杰超 
			getPackingListFun(type = false) {
				let _that = this;
				let params = {
					page: this.pageNumber,
					limit: this.pageSize,
				};
				getPackingListApi(params).then((res) => {
					console.log('获取装箱-----list---->', res)
					if (res.code === 200) {
						// 判断数据中是否有此布卷，如果没有则加入数组中如果有则提示用户
						let resDataList = res.data;
						if (type) {
							this.packingList = this.packingList.concat(resDataList);
						} else {
							this.packingList = resDataList;
						}
						this.loadMoreState = resDataList.length > (this.pageSize - 1) ? true : false;
					} else {
						// this.$refs.uNotify.warning('未查询到布卷信息！')
					}
				})
			},
			// 新增装箱单
			linkPackingClick(type = 'add', item = {
				fid: '',
				fbillNo: '',
				fdocumentStatus:'A'
			}) {
				this.$navTo('pages/warehouse/packingToWarehousing', {
					type: type,
					packingFid: item.fid,
					packingNumber: item.fbillNo,
					fdocumentStatus:item.fdocumentStatus,
					f_RYJF_SCDDH:item.f_RYJF_SCDDH,
				})
			}
		},
		/**
		   * 
		''   * 下拉刷新
		   */
		onPullDownRefresh() {

		},

		/**
		 * 分享当前页面
		 */
		onShareAppMessage() {},

		/**
		 * 分享到朋友圈
		 * 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
		 * https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
		 */
		onShareTimeline() {},
	}
</script>

<style lang="scss">

</style>